<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>在线聊天</title>
    <link rel="icon" href="/leek_bbs/statics/images/favicon.ico" >
    <link rel="stylesheet" href="/leek_bbs/statics/yu-ui/js_css/yu.css">
    <link rel="stylesheet" href="/leek_bbs/statics/layui/css/layui.css">
    <link rel="stylesheet" href="/leek_bbs/statics/bootstrap-3.3.7/css/bootstrap.css">
    <link rel="stylesheet" href="/leek_bbs/statics/css/head.css">
    <link rel="stylesheet" href="/leek_bbs/statics/css/chat_main.css">
    <style>
        footer{
            position: fixed;
            top: 580px;
            width: 100%;
        }
    </style>
</head>
<body>
<audio id="onlinePlayer" src="/leek_bbs/statics/mp3/sx.mp3" hidden></audio>
<div class="container-fluid">
    <!-- 导航开始 -->
    <div id="hmc">
        <head_menu_comp :is_login="isLoginShow" ref="fo"></head_menu_comp>
    </div>
    <!-- 导航结束 -->

    <!-- 页脚部分 -->
    <footer>
        <div class="row">
            <p>
                <span>Copyright &nbsp;© 2020 &nbsp;凛冬</span>
                <span>版权所有&nbsp;All Rights Reserved.</span>
            </p>
        </div>
    </footer>
</div>

<!-- 查找窗口 -->
<div id="layer-2" class="container-fluid" style="display: none">
    <div class="layui-row" >
        <div class="layui-col-sm12" style="border-bottom: 1px solid #D4D4D5;">
            <div class="layui-col-sm6">
                <input type="search" class="layui-input m-c-site" style="background: transparent;border: 1px solid;" placeholder="请输入账号/昵称">
            </div>
            <div class="layui-col-sm3" style="margin-left: 88px;">
                &nbsp;&nbsp;&nbsp;&nbsp;
                <button type="button" class="layui-btn layui-icon layui-icon-search ">查找</button>
            </div>
        </div>
    </div>
    <div class="layui-rwo">
        <div class="layui-col-sm4" v-for="item in search_friends">
            <div class="layui-col-sm6" >
                <a href="javascript:;">
                    <img :src="item.imgSrc" class="img-circle img-size" alt="头像加载失败" title="用户资料">
                </a>
            </div>
            <div class="layui-col-sm6">
                <a href="javascript:;"><span>{{item.username}}</span></a><br>
                <button type="button" class="layui-btn layui-btn-sm layui-icon layui-icon-add-1"><span class="m-s-text">加好友</span></button>
            </div>
        </div>

    </div>
</div>

<!-- 聊天窗口 -->
<!--<div id="layer-3" class="layui-container-fluid" style="display: none">
    <iframe src="/leek_bbs/skipPage/session" frameborder="0" id="chatSession-W" style="width: 100%; height: 250px;"></iframe>
    <div class="layui-row" >
        <textarea id="chatEdit" style="display: none;"></textarea>
    </div>
    <div class="layui-row">
        <div class="layui-col-sm4 layui-col-sm-offset8">
            <div class="m-btn">
                <button class="layui-btn layui-btn-sm">关闭</button>
                <button id="sendBtn" class="layui-btn layui-btn-sm">发送</button>
            </div>
        </div>
    </div>
</div>-->
<script src="/leek_bbs/statics/component/common_import.js"></script>
<script src="/leek_bbs/statics/component/head_menu.js"></script>
<script src="/leek_bbs/statics/js/chat_main.js"></script>
<script>
    new Vue({
        el:"#layer-2",
        data:{
            search_friends:[
                {id:1,username:"马小云",imgSrc:"/leek_bbs/statics/images/u2.jpg"},
                {id:2,username:"成龙",imgSrc:"/leek_bbs/statics/images/u3.jpg"},
                {id:3,username:"谢逊",imgSrc:"/leek_bbs/statics/images/u4.jpg"},
                {id:4,username:"张无忌",imgSrc:"/leek_bbs/statics/images/u2.jpg"},
                {id:5,username:"周芷若",imgSrc:"/leek_bbs/statics/images/u5.jpg"},
                {id:6,username:"赵敏",imgSrc:"/leek_bbs/statics/images/u3.jpg"}
            ]
        }
    })

</script>

</body>
</html>